import { delete_department, department_list, edit_depart_status } from '@/services/department';
import paging_fun from '@/utils/paging';
import { InfoCircleTwoTone, PlusOutlined } from '@ant-design/icons';
import { ActionType, PageContainer, ProColumns, ProTable } from '@ant-design/pro-components';
import { Button, Divider, message, Modal, Switch } from 'antd';
import { useRef, useState } from 'react';
import AddDepartment from './components/AddDepartment';
import EditDepartment from './components/EditDepartment';
type GithubIssueItem = {
  id: number;
  name: string;
  parent_name: string;
  manage_name: string;
  create_time: string;
  status: number;
};
const DepartmentManagement = () => {
  const actionRef = useRef<ActionType>();
  // 存储当前科室id
  const [id, setId] = useState();
  // 存储新建科室模态框的状态
  const [isAddModalOpen, setIsAddModalOpen] = useState(false);
  // 存储编辑科室模态框的状态
  const [isEditModalOpen, setIsEditModalOpen] = useState(false);
  // 存储删除科室模态框状态
  const [isDelModalOpen, setIsDelModalOpen] = useState(false);
  // 控制新建科室模态框的显示与隐藏
  const isShowAddModal = (show: boolean) => {
    setIsAddModalOpen(show);
  };
  // 控制编辑科室模态框的显示与隐藏
  const isShowEditModal = (show: boolean) => {
    setIsEditModalOpen(show);
  };
  // 控制删除科室模态框的显示与隐藏
  const isShowDelModal = (show: boolean) => {
    setIsDelModalOpen(show);
  };
  // 获取科室列表
  const get_department_list = async (params: {
    pageSize?: number | undefined;
    current?: number | undefined;
    keyword?: string | undefined;
  }) => {
    let request_body = {
      ...params,
      current: params.current,
      pageSize: params.pageSize,
    };
    let res = await department_list(request_body);
    console.log('科室列表', res);
    return {
      data: res.data.list,
      success: true,
      total: res.data.total_count,
    };
  };
  // 启用/禁用科室
  const edit_departstatus = async (id: number, status: boolean) => {
    let request_body = {
      id,
      status: status ? 1 : 0,
    };
    const res: any = await edit_depart_status(request_body);
    if (res.msg == 'ok') {
      if (status) {
        message.success('科室启用成功！');
      } else {
        message.success('科室禁用成功！');
      }
      actionRef.current?.reload();
    } else {
      message.error(res.msg);
      actionRef.current?.reload();
    }
  };
  // 确认删除科室
  const delOk = async () => {
    let request_body = {
      id,
    };
    const res: any = await delete_department(request_body);
    if (res.msg == 'ok') {
      actionRef.current?.reload();
      paging_fun(actionRef);
      message.success('删除成功');
    } else {
      message.error(res.msg);
    }
    isShowDelModal(false);
  };
  // 科室列表字段
  const columns: ProColumns<GithubIssueItem>[] = [
    {
      title: '序号',
      dataIndex: 'index',
      hideInSearch: true,
      valueType: 'index',
      align: 'center',
    },
    {
      title: '科室ID',
      dataIndex: 'id',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '科室名称',
      dataIndex: 'name',
      align: 'center',
    },
    {
      title: '上级名称',
      dataIndex: 'parent_name',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '创建人',
      dataIndex: 'manage_name',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '创建时间',
      dataIndex: 'create_time',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '状态',
      dataIndex: 'status',
      align: 'center',
      valueEnum: {
        0: {
          text: '禁用',
        },
        1: {
          text: '启用',
        },
      },
      render: (_: any, record: { status: number; id: number }) => {
        console.log(record.status);

        return (
          <Switch
            key={record.status === 1}
            checkedChildren="启用"
            unCheckedChildren="禁用"
            checked={record.status === 1}
            onChange={(event) => {
              edit_departstatus(record.id, event);
            }}
          />
        );
      },
    },
    {
      title: '操作',
      hideInSearch: true,
      key: 'action',
      align: 'center',
      render: (_: any, record: { id: any; status: number }) => [
        <Button
          key="Editor"
          type="link"
          onClick={() => {
            setId(record.id);
            isShowEditModal(true);
          }}
          disabled={record.status === 1}
        >
          编辑
        </Button>,
        <Button
          key="Del"
          type="link"
          onClick={() => {
            setId(record.id);
            isShowDelModal(true);
          }}
          disabled={record.status === 1}
        >
          删除
        </Button>,
      ],
    },
  ];
  return (
    <PageContainer breadcrumb={false}>
      <ProTable
        columns={columns}
        actionRef={actionRef}
        request={async (params = {}, sort, filter) => get_department_list(params)}
        rowKey={(record) => record.id}
        search={{
          labelWidth: 'auto',
          collapseRender: false,
          collapsed: false,
          span: 6,
        }}
        pagination={{
          pageSize: 10,
        }}
        dateFormatter="string"
        headerTitle="科室列表"
        toolBarRender={() => [
          <Button
            key="button"
            icon={<PlusOutlined />}
            type="primary"
            onClick={() => isShowAddModal(true)}
          >
            新建
          </Button>,
        ]}
      />
      {/* 新增科室模态框组件 */}
      {isAddModalOpen ? (
        <AddDepartment
          isAddModalOpen={isAddModalOpen}
          isShowAddModal={isShowAddModal}
          actionRef={actionRef}
        ></AddDepartment>
      ) : (
        ''
      )}
      {/* 编辑科室模态框组件 */}
      {isEditModalOpen ? (
        <EditDepartment
          isEditModalOpen={isEditModalOpen}
          isShowEditModal={isShowEditModal}
          actionRef={actionRef}
          id={id}
        ></EditDepartment>
      ) : (
        ''
      )}
      {/* 删除科室模态框组件 */}
      <Modal
        title="删除确认"
        open={isDelModalOpen}
        onOk={delOk}
        onCancel={() => isShowDelModal(false)}
      >
        <Divider />
        <p>
          <InfoCircleTwoTone twoToneColor="#ffcc00" /> 科室信息删除后无法恢复，确定要删除吗？
        </p>
      </Modal>
    </PageContainer>
  );
};
export default DepartmentManagement;
